<% include ./base/layout.ejs %>

<section class="container-fluid">
    <% include ./base/header.ejs %>
    <div class="row">
        <% include ./base/sidebar.ejs %>
        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-lg-10 col-md-offset-2 main" id="main">
            <form action="/Article/checkAll" method="post">
                <h1 class="page-header">操作</h1>
                <ol class="breadcrumb">
                    <li><a href="add-article">增加文章</a></li>
                </ol>
                <h1 class="page-header">管理 <span class="badge"><%= SumCount %></span></h1>
                <div class="table-responsive">
                    <table class="table table-striped table-hover">
                        <thead>
                        <tr>
                            <th><span class="glyphicon glyphicon-th-large"></span> <span class="visible-lg">选择</span>
                            </th>
                            <th><span class="glyphicon glyphicon-file"></span> <span class="visible-lg">标题</span></th>
                            <th><span class="glyphicon glyphicon-list"></span> <span class="visible-lg">栏目</span></th>
                            <th class="hidden-sm"><span class="glyphicon glyphicon-tag"></span> <span
                                        class="visible-lg">标签</span></th>
                            <th class="hidden-sm"><span class="glyphicon glyphicon-comment"></span> <span
                                        class="visible-lg">评论</span></th>
                            <th><span class="glyphicon glyphicon-time"></span> <span class="visible-lg">日期</span></th>
                            <th><span class="glyphicon glyphicon-pencil"></span> <span class="visible-lg">操作</span></th>
                        </tr>
                        </thead>
                        <tbody>
                            <%#  前端例子
                            <tr>
                                <td><input type="checkbox" class="input-control" name="checkbox[]" value=""/></td>
                                <td class="article-title">这是测试的文章标题这是测试的文章标题这是测试的文章标题这是测试的文章标题</td>
                                <td>这个是栏目</td>
                                <td class="hidden-sm">PHP、JavaScript</td>
                                <td class="hidden-sm">0</td>
                                <td>2015-12-03</td>
                                <td><a href="update-article">修改</a> <a rel="6">删除</a></td>
                            </tr>
                            %>
                            <% if (articles.length > 0) { %>
                                <% articles.forEach(function (article) { %>
                                <tr>
                                    <td><input type="checkbox" class="input-control" name="checkbox[]" value=""/></td>
                                    <td class="article-title"><%= article.title %></td>
                                    <td>这个是栏目</td>
                                    <td class="hidden-sm">PHP、JavaScript</td>
                                    <td class="hidden-sm">0</td>
                                    <td><%= article.time %></td>
                                    <td>
                                        <a href="update-article?articleID=<%= article._id %>">修改</a>
                                        <a onclick="deleteArticle('<%= article._id %>')" rel="6">删除</a>
                                    </td>
                                </tr>
                                <% }) %>
                            <% } %>
                        </tbody>
                    </table>
                </div>
                <footer class="message_footer">
                    <nav>
                        <div class="btn-toolbar operation" role="toolbar">
                            <div class="btn-group" role="group"><a class="btn btn-default" onClick="select()">全选</a> <a
                                        class="btn btn-default" onClick="reverse()">反选</a> <a class="btn btn-default"
                                                                                              onClick="noselect()">不选</a>
                            </div>
                            <div class="btn-group" role="group">
                                <!--<button type="submit" class="btn btn-default" data-toggle="tooltip"-->
                                        <!--data-placement="bottom" title="删除全部选中" name="checkbox_delete">删除-->
                                <!--</button>-->
                                <button onclick="deleteArticle()" class="btn btn-default" data-toggle="tooltip"
                                        data-placement="bottom" title="删除全部选中" name="checkbox_delete">删除
                                </button>
                            </div>
                        </div>
                        <ul class="pagination pagenav">
                            <% if(curentPage == 1){ %>
                                <li class="disabled"><a aria-label="Previous"> <span aria-hidden="true">&laquo;</span> </a>
                            <% } else { %>
                                <li class=""><a href="?page=<%= parseInt(curentPage)-1 %>" aria-label="Previous"> <span aria-hidden="true">&laquo;</span> </a>
                            <% } %>

                            </li>
                            <% for (i=1; i<pageCount+1; i++) { %>
                                <% if(i == curentPage){ %>
                                    <li class="pageNum active"><a href="?page=<%= i %>"><%= i %></a></li>
                                <% } else { %>
                                    <li class="pageNum"><a href="?page=<%= i %>"><%= i %></a></li>
                                <% } %>
                            <% } %>

                            <% if(curentPage == pageCount){ %>
                                <li class="disabled"><a aria-label="Next"> <span aria-hidden="true">&raquo;</span> </a></li>
                            <% } else { %>
                                <li><a href="?page=<%= parseInt(curentPage)+1 %>" aria-label="Next"> <span aria-hidden="true">&raquo;</span> </a></li>
                            <% } %>
                        </ul>
                    </nav>
                </footer>
            </form>
        </div>
    </div>
</section>

<!--个人信息模态框-->
<% include ./base/seeUserInfo.ejs %>

<!--个人登录记录模态框-->
<% include ./base/seeUserLoginlog.ejs %>

<!--微信二维码模态框-->
<% include ./base/WeChatModalLabel.ejs %>

<!--提示模态框-->
<% include ./base/areDeveloping.ejs %>

<!--右键菜单列表-->
<% include ./base/rightClickMenu.ejs %>


<script>
    //是否确认删除
    $(function () {
        $("#main table tbody tr td a").click(function () {
            var name = $(this);
            var id = name.attr("rel"); //对应id
            if (event.srcElement.outerText == "删除") {
                if (window.confirm("此操作不可逆，是否确认？")) {
                    $.ajax({
                        type: "POST",
                        url: "/Article/delete",
                        data: "id=" + id,
                        cache: false, //不缓存此页面
                        success: function (data) {
                            window.location.reload();
                        }
                    });
                }
                ;
            }
            ;
        });
    });

    jQuery(document).ready(function($) {
        $('.pageNum').click(function(event) {
            $('.pageNum').removeClass('active');
            $(this).addClass('active');
        });
    });

    function deleteArticle(articleID) {
        if(!confirm('是否确认删除？'))return false

        $.ajax({
            url: '/delete-article',
            type: 'DELETE',
            data: {articleID: articleID},
        })
                .done(function() {
                    console.log("success");
                })
                .fail(function() {
                    console.log("error");
                })
                .always(function() {
                    console.log("complete");
                    location.reload()
                });
    }
</script>

<%- include ./base/layout.ejs %>